
//
<template>
  <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
    <!-- 首页链接 -->
    <router-link to="/" index="1" class="el-menu-item">首页</router-link>

    <!-- 餐厅链接，这里假设你有一个特定的餐厅ID，例如1 -->
    <!-- 如果你想要一个通用的链接，你可能需要在点击时通过编程方式导航 -->
    <router-link to="/restaurant" index="2" class="el-menu-item">餐厅</router-link>

    <!-- 用户信息链接 -->
    <router-link to="/user" index="3" class="el-menu-item">用户信息</router-link>
  </el-menu>
</template>

<script>
export default {
  data() {
    return {
      activeIndex: '1' // 定义一个响应式数据 activeIndex，并初始化为 '1'
    }
  },
  methods: {
    navigateTo(route, id) {
      this.$router.push({ path: route, params: { id: id } }); // 定义 navigateTo 方法，用于导航到指定路由并传递参数
    }
  }
}

</script>

<style scoped>
.el-menu-demo {
  background-color: #fffefb;
  color: #151514;
}
</style>